<template>
	<view class="warp" v-if="numberinfo.numberDetailList">
		<view  v-if="!auditShow">
			<other></other>
		</view>
		<!-- <view class="report_change flex_row_center_center" v-if="auditShow" @click="userChange">
			<image class="report_change_icon" src="https://sy-hws-file-oss.oss-cn-beijing.aliyuncs.com/yijing/change_icon.png" mode="aspectFit"></image>
		    <view>切换档案生成新的报告</view>
		</view> -->
		<!-- 基本信息 -->
		<view class="userinfo" v-if="auditShow">
			<view class="usernumber">
				<view class="user_title">
					您的号码
				</view>
				<view class="user_cont" style="letter-spacing: 16rpx;font-size: 32rpx;font-weight: 550;">
					{{numberinfo.number}}
				</view>
			</view>
			<view class="userganzhi">
				<view class="user_title">
					您的四柱
				</view>
				<view class="user_cont" style="font-size: 32rpx;font-weight: 550;">
					<view class="year">
						{{numberinfo.nianZhu}}
					</view>
					<view class="yue">
						{{numberinfo.yueZhu}}
					</view>
					<view class="ri">
						{{numberinfo.riZhu}}
					</view>
					<view class="shi">
						{{numberinfo.shiZhu}}
					</view>
				</view>
			</view>
		</view>
		<!-- 数字排列 -->
		<view class="fenxi_box" v-if="numberinfo.numberDetailList && auditShow">
			<view class="pailie">
				<view class="title">
					排列
				</view>
				<view class="textcont">
					<view class="tex_item" v-for="(item,index) in numberinfo.numberDetailList" :key="index">
						{{item.paiLie}}
					</view>
				
					 
					
				</view>
			</view>
			<view class="baxing">
				<view class="title">
					八星
				</view>
				<view class="textcont">
				 
						<view class="tex_item" v-for="(item,index) in numberinfo.numberDetailList" :key="index">
							{{item.baXing}}
						</view>
						 
				 
				</view>
			</view>
			<view class="power">
				<view class="title">
					能量
				</view>
				<view class="textcont">
					
					<view class="tex_item" v-for="(item,index) in numberinfo.numberDetailList" :key="index">
						{{item.nengLiang}}
					</view>
					 
				</view>
			</view>
		</view>
		<!-- 打分 -->
		<view class="numbersorts" v-if="numberinfo.numberDetailList && auditShow">
			<view class="number_title">
				您的号码得分：
			</view>
			<view class="numsort_cont">
				<span style="font-size: 58rpx; font-weight: 550;color: #88b7ff;">{{numberinfo.scores}}</span>
				<span style="font-size: 38rpx; margin-left: 10rpx;color: #88b7ff;">分</span>
			</view>
			<view class="number_star">
				<uni-icons v-if="numberinfo.scores>=20" type="star-filled" color="#88b7ff" size="24"></uni-icons>
				<uni-icons v-if="numberinfo.scores>=40" type="star-filled" color="#88b7ff" size="24"></uni-icons>
				<uni-icons v-if="numberinfo.scores>=60" type="star-filled" color="#88b7ff" size="24"></uni-icons>
				<uni-icons v-if="numberinfo.scores>=80" type="star-filled" color="#f8ec8a" size="24"></uni-icons>
				<uni-icons v-if="numberinfo.scores>=100" type="star-filled" color="#88b7ff" size="24"></uni-icons>
				
				 <uni-icons v-if="numberinfo.scores<100" type="star" size="24"></uni-icons>
				 <uni-icons v-if="numberinfo.scores<80" type="star" size="24"></uni-icons>
				 <uni-icons v-if="numberinfo.scores<60" type="star" size="24"></uni-icons>
				 <uni-icons v-if="numberinfo.scores<40" type="star" size="24"></uni-icons>
				 <uni-icons v-if="numberinfo.scores<20" type="star" size="24"></uni-icons>
			</view>
		</view>
	<!-- 分析展示 -->
	<view class="verdictbox" v-if="numberinfo.numberDetailList && auditShow">
		<view class="title">
			<view class="line">
				
			</view>
			<view class="text">
				号码分析
			</view>
		</view>
		
		<view class="vb_xingge vb-cont" v-if="false">
			<span style="color: #8b490c;font-size: 28rpx; font-weight: 550;">【性格】</span>
		<span v-if="numberinfo.xingGe">{{numberinfo.xingGe}}</span>	
		<span v-else>无</span>
		</view>
		<view class="vb_caifu vb-cont">
			<span style="color: #f8e893;font-size: 28rpx; font-weight: 550;">【财富】</span>
		<span v-if="numberinfo.caiYun">{{numberinfo.caiYun}}</span>
		<span v-else>无</span>
		</view>
		<view class="vb_ganqing vb-cont">
			<span style="color: #fa000d;font-size: 28rpx; font-weight: 550;">【感情】</span>
		<span v-if="numberinfo.hunYin">{{numberinfo.hunYin}}</span>
		<span v-else>无</span>
		 
		</view>
		<view class="vb_jiankang vb-cont">
			<span style="color: #0e8b12;font-size: 28rpx; font-weight: 550;">【健康】</span>
		<span v-if="numberinfo.jianKang">{{numberinfo.jianKang}}</span>
		<span v-else>无</span>
	 
		</view>
	</view>
	<view class="bazi_fenxi" v-if="numberinfo.numberDetailList && auditShow">
		<view class="fenxi_title">
			八字建议：
		</view>
		<view class="fenxi_cont">
			{{numberinfo.conclusion}}
		</view>
	</view>
	<!-- 推荐数字 -->
	<view class="refernumber" v-if="numberinfo.numberDetailList && auditShow">
		<view class="title">
			根据四柱推荐号码尾数
		</view>
		<uni-notice-bar v-if="numberinfo.scores*1>=85" showIcon showClose  scrollable single text="当前号码和您的八字契合度较高,非必要不需更改!"></uni-notice-bar>

		<view class="numbers">
			<view class="num_item" v-for="(item,index) in numberinfo.luckyNumberList" :key="index">
				<view class="number_text">
					{{item.number}}
				</view>
				<view class="num_text_state">
					{{item.numberLevel}}
				</view>
			</view>
		</view>
	</view>
	<!-- 提示 -->
	<view class="warn_text">
		<uni-icons   type="help" size="14px"></uni-icons>
		当前内容仅供您在娱乐中探索自我，不等于专业测评，不代表价值评判，无任何现实指导意义
	</view>
	</view>
</template>

<script>
	import {mapState,mapMutations} from 'vuex'
	import other from '@/components/other/index.vue'
	export default{
			components:{other},
		 data(){
			return{
				auditShow:false,
				objInfo:{},
				form:{
					year:'',
					month:'',
					day:'',
					hour:'',
					minute:'',
					dateType:'',
					leapMonth:'',
					phone:'',
					numberType:''
				},
				numberinfo:{}
			}
		},
		onLoad(options) {
			if ('numberobj' in options) {
			      let obj = JSON.parse(decodeURIComponent(options.numberobj));
				   this.form=obj
				   // this.form.phone=obj.masterPhone
				   console.log(obj);
				  // this.objInfo=obj
				 // // this.getList(obj.name)
				 // this.form.year=this.objInfo.masterInfo.masterBirthday.split(' ')[0].split('/')[0]
				 // this.form.month=this.objInfo.masterInfo.masterBirthday.split(' ')[0].split('/')[1]
				 // this.form.day=this.objInfo.masterInfo.masterBirthday.split(' ')[0].split('/')[2]
				 // this.form.hour=this.objInfo.masterInfo.masterBirthday.split(' ')[1].split(':')[0]
				 // this.form.minute=this.objInfo.masterInfo.masterBirthday.split(' ')[1].split(':')[1]
				 // this.form.dateType=this.objInfo.masterInfo.isLeap=='true' || this.objInfo.masterInfo.isLeap=="false"?'1':'0'
				 // this.form.leapMonth=this.objInfo.masterInfo.isLeap=='true'?true:false
				 // this.form.phone=this.objInfo.masterPhone
				 // this.form.numberType=this.objInfo.masterPhone.length==11?1:2
				this.getnumberinfo()
			 }else{
				 // uni.navigateBack({delta:1})
			 }
		},
		onShow() {
			this.getAudit()
		},
		methods:{
			//获取微信审核开关
			getAudit(){
			    let param = {};
				param.url='v3/system/front/configuration/1'
				this.$request(param).then(res=>{
					console.log(res);
					this.auditShow=res.data.auditSwitch
					if(this.auditShow){
						uni.setNavigationBarTitle({
							title:'号码数理'
						})
					}
				})
			},
			// 获取身份信息
			
			getnumberinfo(){
				this.$request({
					url:'v3/front/number/converted',
					method:'POST',
					data:this.form,
					header:{
						'Content-Type': 'application/json;charset=utf-8',
					},
				}).then(res=>{
					this.numberinfo=res.data
					// console.log(res,'jieguio',numberinfo.scores*1/10);
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #f0eff4;
	}
	.warp{
		padding: 30rpx;
		.userinfo{
			background-color: #fff;
			padding: 20rpx;
			border-radius: 40rpx;
			font-size: 28rpx;
			.usernumber{
				height: 90rpx;
				line-height: 90rpx;
				border-bottom: 2rpx solid #cecece;
				display: flex;
				.user_title{
					width: 25%;
					padding: 0 20rpx 0 10rpx;
					color: #88b7ff;
					border-right: 2rpx solid #cecece;
					
				}
				.user_cont{
					width: 75%;
					// text-align: center;
					padding: 0 10rpx 0 30rpx;
					color: #a17c0b;
				}
			}
			.userganzhi{
				height: 90rpx;
				line-height: 90rpx;
				display: flex;
				.user_title{
					width: 25%;
					padding: 0 20rpx 0 10rpx;
					color: #88b7ff;
					border-right: 2rpx solid #cecece;
				}
				.user_cont{
					width: 75%;
					color: #a17c0b;
					display: flex;
					justify-content: space-between;
					padding: 0 120rpx 0 30rpx;
				 
				}
			}
		}
	.fenxi_box{
		background-color: #fff;
		padding: 20rpx;
		border-radius: 20rpx;
		margin-top: 20rpx;
	}
	.power,.baxing,.pailie{
		display: flex;
		height: 80rpx;
		line-height: 80rpx;
		font-size: 26rpx;
		border-bottom: 2rpx solid #ececec;
		.title{
			width: 15%;
			text-align: center;
				color: #88b7ff;
		}
		.textcont{
			width: 85%;
			display: flex;
			justify-content: space-between;
			padding: 0 20rpx 0 10rpx;
			color: #836408;
			.tex_item{
				 width: 100%;
				border-left: 2rpx solid #ececec;
				text-align: center;
				font-size: 28rpx;
				 
			}
		}
		
	}
	.pailie{
		background: #f2f2f2;
	}
	.baxing{
		// background: #f2f2f2;
		.tex_item{
			font-size: 26rpx !important;
		}
		
	}
	.power{
		background: #f2f2f2;
		.tex_item{
			font-size: 24rpx !important;
			// border-left: 2rpx solid #bcbcbc;
		}
	}
	// 打分
	.numbersorts{
		padding: 20rpx;
		background-color: #fff;
		border-radius: 10rpx;
		margin-top: 20rpx;
		text-align: center;
		.number_title{
			font-size: 34rpx;
			font-weight: 550;
			color: #7098d3;
			padding: 10rpx 0;
		}
		.number_star{
			font-size: 50rpx;
			
		}
	}
	// 结论
	.verdictbox{
		// background-color: #fff;
		// padding: 20rpx;
		margin-top: 30rpx;
		.title{
			height: 80rpx;
			padding:0 20rpx;
			line-height: 80rpx;
			font-size: 28rpx;
			background-color: #fff;
			border-radius: 10rpx;
			font-weight: 600;
			color: #88b7ff;
			display: flex;
			align-items: center;
			.line{
				width: 10rpx;
				height: 40rpx;
				background-color: #88b7ff;
				border-radius: 4rpx;
				margin-right: 10rpx;
			}
		}
		.vb-cont{
			margin-top: 10rpx;
			background-color: #fff;
			padding: 20rpx;
			letter-spacing: 4rpx;
			font-size: 26rpx;
			line-height: 57rpx;
			border-radius: 10rpx;
		}
	}
	}
	.bazi_fenxi{
		background-color: #fff;
		margin-top: 20rpx;
		padding: 20rpx;
		border-radius: 20rpx;
		.fenxi_title{
			height: 80rpx;
			padding:0 20rpx;
			line-height: 80rpx;
			font-size: 28rpx;
			background-color: #fff;
			border-radius: 10rpx;
			font-weight: 600;
			color: #88b7ff;
		}
		.fenxi_cont{
			font-size: 28rpx;
			color: #0e8b12;
		}
	}
	// 推荐数字
	.refernumber{
		background-color: #fff;
		margin-top: 20rpx;
		padding: 0 0 20rpx 0;
		border-radius: 20rpx;
		.title{
			height: 80rpx;
			line-height: 80rpx;
			background-color: #88b7ff;
			color: #fff;
			text-align: center;
			font-size: 28rpx;
			border-radius:20rpx 20rpx 0 0 ;
		}
		.numbers{
			padding: 30rpx 30rpx 0 30rpx;
			display: flex;
			// justify-content: space-between;
			flex-wrap: wrap;
			.num_item{
				width: 10%;
				margin-right: 10%;
				margin-bottom: 10rpx;
				.number_text{
					color: #2366c2;
					font-size: 30rpx;
					font-weight: 600;
					border: 2rpx solid #cecece;
					height: 67rpx;
					line-height: 67rpx;
					border-radius: 10rpx;
					text-align: center;
					letter-spacing: 2rpx;
					margin-bottom: 5rpx;
				}
				.num_text_state{
					font-size: 26rpx;
					text-align: center;
					color: #cecece;
				}
			}
		}
	}
// 提示
.warn_text{
	margin-top: 20rpx;
	padding-bottom: 50rpx;
	font-size: 26rpx;
	// font-weight: 550;
	letter-spacing: 2rpx;
	line-height: 40rpx;
}
</style>